---
import { Icon } from "@astrojs/starlight/components";

const { class: className } = Astro.props;
---

<div class:list={["text-center text-pretty lg:w-lg", className]}>
  <h2>
    <Icon class="relative -top-0.5 inline align-middle" name="discord" /> Join Our
    Discord Community
  </h2>
  <p>
    If you want to keep up with the TUIs I'm developing or just want to nerd out
    about the terminal - <br /><a
      href="https://discord.gg/SXNXp9NctV"
      target="_blank">come join us!</a
    >
  </p>
</div>
